<template>
	<div>
		<ul>
		<!-- 	<li>
			<a href="#/">HelloWord</a>
			<router-link to="/">HelloWord</router-link>
		</li>
		<li>
			<a href="#/wen">HelloIWen</a>
			<router-link to="/wen">HelloIWen</router-link>
		</li> -->
		<!-- 动态 -->
		  <li v-for="menu in menus">
		  	 <router-link :to="{path:menu.path}">{{menu.name}}</router-link>
		  	<!--  <router-link :to="menu.path">{{menu.name}}</router-link> -->
		  </li>
		</ul>
	</div>
</template>
<script>
	export default{
		data(){
			return {
				menus:[
					{
						path:'/',
						name:'HelloWord'
					},
					{
						path:'/wen',
						name:'HelloIWen'
					},
					{
						path:'/header',
						name:'Header'
					}
				]
			}
		},
		methods: {

		},
		component: {

		},
		computed: {
			
		},
		created() {

		}
	}
</script>
<style scoped>
	ul {
		list-style: none;
		text-align: center;
	}

	ul li {
		display: inline-block;
		margin: 0 20px;
	}
</style>